<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基础数据列表</title>
    <%include("/WEB-INF/views/common/basejs.html"){}%>
    <link rel="stylesheet" href="${ctxPath!}/css/admin.css" media="all">
    <!--引入ztree相关资源-->
    <link rel="stylesheet" type="text/css" media="screen" href="${ctxPath!}/js/zTree_v3/css/metroStyle/metroStyle.css">
   <!-- <script type="text/javascript" src="${ctxPath!}/js/zTree_v3/js/jquery-1.4.4.min.js"></script>-->
    <script type="text/javascript" src="${ctxPath!}/js/zTree_v3/js/jquery.ztree.core.min.js"></script>
    <script type="text/javascript" src="${ctxPath!}/js/zTree_v3/js/jquery.ztree.excheck.min.js"></script>
    <script type="text/javascript" src="${ctxPath!}/js/base/jquery-layout/jquery.layout.js"></script>
    <link rel="stylesheet" type="text/css" media="screen" href="${ctxPath!}/js/base/jquery-layout/jquery.layout.css">
    <!--行级别工具栏模板-->
    <script type="text/html" id="rowTool">
        <div class="layui-btn-container">
            <a class="layui-btn layui-btn-xs" lay-event="update">编辑</a>
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
        </div>
    </script>
    <script type="text/html" id="toolbar">
        <div class="layui-btn-container">
            <button class="layui-btn layui-btn-sm" lay-event="add">新增</button>
            <button class="layui-btn layui-btn-sm" lay-event="delAll">删除</button>
        </div>
    </script>
    <script>
        var queryForm;
        var baseDataTableObj;
        var baseDataTree;
        var baseDataTable;
        var layer;
        var addPageIndex;//添加页面索引
        var editPageIndex;//编辑页面索引
        var tableId='baseDataTable';
        layui.use(['table','layer','form'],function (){
            baseDataTable = layui.table;
            layer=layui.layer;
            queryForm=layui.form;
            initLayout();
            //查询表单点击查询事件
            queryForm.on('submit(queryForm)',function(data){
               var param=getCommonQueryData(data.field);
               baseDataTableObj.reload({
                    where: param
                    ,page: {
                        curr: 1 //重新从第 1 页开始
                    }
                });
                return false;
            });
        });
        //初始化layout
        function initLayout(){
            $('body').layout({west__size:'50%',west:{minSize:260}});
            //基础数据树
            initBaseDataTree();

            initTableData();
            //初始化表格监听事件
            initTableToolBar();
        }
        //初始化表格数据
        function initTableData(){
            //默认查询根节点数据
            baseDataTableObj=baseDataTable.render({
                elem:'#baseDataTable'
                ,toolbar:'#toolbar'
                ,url:basePath+'/baseData/getList?paging=true'
                ,page:true
                ,cols:[[ //表头
                    {type:'checkbox',fixed:'left'}
                    ,{field: 'name',title:'名称'}
                    ,{field: 'nodeCode',title:'编码'}
                    ,{field: 'value',title:'值'}
                    ,{field: 'memo',title:'备注'}
                    ,{field: 'status',title:'状态',
                        templet: function(obj){
                            if(obj.status==1){
                                return '<span class="layui-btn layui-btn-sm layui-btn-normal">有效</span>';
                            }else{
                                return '<span class="layui-btn layui-btn-sm layui-btn-danger">冻结</span>';
                            }
                        }
                    }
                    ,{fixed:'right',title:'操作', align:'center',toolbar:'#rowTool'}
                ]]
            });
        }
        //监听行级表格工具栏事件
        function initTableToolBar(){
            //行级别数据操作监听
            baseDataTable.on('tool(toolbar)',function(obj){
                var id=obj.data.id;
                switch(obj.event){
                    case 'detail':
                        layer.msg('查看');
                        break;
                    case 'delete':
                        del(id);
                        break;
                    case 'update':
                        editPage(id);
                        break;
                    case 'grant':
                        grantPage(id);
                };
            });
            //表级别数据操作监听
            baseDataTable.on('toolbar(toolbar)',function(obj){
                console.log("obj");
                console.log(obj);
                switch(obj.event){
                    case 'add':
                        var myPid;
                        var node=baseDataTree.getCheckedNodes(true);
                        if(node.length){
                            myPid=node[0].id;
                        }
                        addPage(myPid);
                        break;
                    case 'delAll':
                        layer.msg('删除所有');
                        break;
                };
            });
        }
        //初始化左侧菜单树
        function initBaseDataTree(){
            //查询有效的部门
            /*var conditions=[];
            var param={};
            param.columnName="status";
            param.value="1";
            conditions.push(param);*/
            var setting = {
                //简单的数据list
                data:{
                    simpleData: {
                        enable: true,
                        idKey: "id",
                        pIdKey: "pid",
                        rootPId: null
                    },
                    key:{ name:"name" ,value:"id" }
                },
                check:{
                    enable: true,
                    chkStyle: "radio",
                    radioType:"all"
                },
                view: {
                    showLine: false,
                    selectedMulti: false
                },
                async: {
                    enable: true,
                    type: 'post',
                    url: basePath + "/baseData/getList",
                    dataType:"JSON",
                    /*otherParam: { "conditions":JSON.stringify(conditions)}*/
                },
                callback: {
                    onClick: function (event, treeId, treeNode) {
                        var params=[];
                        var param={};
                        param.columnName='pid';
                        param.value=treeNode.id;
                        params.push(param);
                        baseDataTable.reload(tableId, {
                            url: basePath+'/baseData/getList?paging=true'
                            ,where: {conditions:JSON.stringify(params)} //设定异步数据接口的额外参数
                            //,height: 300
                        });
                        //console.log(treeNode);
                    },
                    onAsyncSuccess: function(){//默认展开所有节点
                        baseDataTree.expandAll(true);
                    }
                }
            };
            baseDataTree=$.fn.zTree.init($("#baseDataTree"),setting);
        }
        function del(id){
            layer.confirm("你确定当前节点以及子节点吗?", {icon: 3, title:'提示'},
                function(index){//确定回调
                    $.ajax({
                        url:basePath+'/baseData/delete',
                        type:'post',
                        data:{ids:id},
                        dataType:'json',
                        success:function(data){
                            if(data.code==0){
                                baseDataTree.reAsyncChildNodes(null, "refresh");
                                query();
                            }
                            layer.close(index);
                            layer.msg(data.msg);
                        },
                        error:function(){
                            layer.close(index);
                            layer.msg("删除节点失败,系统内部错误");
                        }
                    });
                },function (index) {//取消回调
                    layer.close(index);
                }
            );
        }
        //弹出新增资源页面
        function addPage(pid){
            var url=basePath+"/baseData/addPage";
            if(pid){
                url=basePath+'/baseData/addPage?pid='+pid;
            }
            addPageIndex=layer.open({
                title:'基础数据添加',
                type: 2,
                content:url,
                area: ['600px', '400px'],
                maxmin:true,
                btn: ['新增', '取消']
                ,yes: function(index, layero){
                    var submit = layero.find('iframe').contents().find("#form-submit");
                    submit.click();
                }
            })
        }
        function editPage(id){
            editPageIndex=layer.open({
                title:'基础数据编辑',
                type: 2,
                content:basePath+'/baseData/editPage?id='+id,
                area: ['600px', '400px'],
                maxmin:true,
                btn: ['编辑', '取消']
                ,yes: function(index, layero){
                    var submit = layero.find('iframe').contents().find("#form-submit");
                    submit.click();
                }
            })
        }
        //表格重新加载
        function query(){
            baseDataTable.reload(tableId);
        }
        //关闭添加页面
        function closeAddPage(){
            layer.close(addPageIndex);
        }
        //关闭编辑页面
        function closeEditPage(){
            layer.close(editPageIndex);
        }

        /**
         * 修改树操作
         */
        function modifyTree(opertator){
            var id;
            var nodes=baseDataTree.getCheckedNodes(true);
            if(opertator=='edit'||opertator=='delete'){
                 if(nodes.length===0){
                     layer.alert("请选中要操作节点");
                     return;
                 }
            }
            if(nodes.length){
                id=nodes[0].id;
            }
            switch(opertator){
                case 'add':
                    addPage(id);
                    break;
                case 'edit':
                    editPage(id);
                    break;
                case 'delete':
                    del(id);
                    break;
                default:
                    ;
            }
        }
    </script>
</head>
<body class="layui-layout-body">
    <!--组织结构导航-->
    <div class="ui-layout-west">
        <div class="layui-card" style="height:100%;">
            <div class="layui-card-header" style="position:relative">
                <span class="layui-word-aux	">基础数据</span>
                <div class="layui-btn-group" style="position:absolute;right:10px;">
                    <button class="layui-btn layui-btn-primary layui-btn-sm" onclick="modifyTree('add')">
                        <i class="layui-icon layui-icon-add-1" style="position:static"></i>
                    </button>
                    <button class="layui-btn layui-btn-primary layui-btn-sm" onclick="modifyTree('edit')">
                        <i class="layui-icon layui-icon-edit" style="position:static"></i>
                    </button>
                    <button class="layui-btn layui-btn-primary layui-btn-sm" onclick="modifyTree('delete')">
                        <i class="layui-icon layui-icon-delete" style="position:static"></i>
                    </button>
                </div>
            </div>
            <div class="layui-card-body">
                <ul id="baseDataTree" class="ztree">

                </ul>
            </div>
        </div>
    </div>
    <!--数据展示区-->
    <div class="ui-layout-center">

        <div class="layui-fluid">
            <div class="layui-card">
                <!--查询form区域-->
                <form id="queryForm" class="layui-form layui-card-header layuiadmin-card-header-auto">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">名称</label>
                            <div class="layui-input-inline">
                                <input type="text" name="name" placeholder="请输入" autocomplete="off" class="layui-input" operator="like">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn" lay-submit="" lay-filter="queryForm">查询</button>
                            <button type="reset" class="layui-btn layui-btn-primary">清空</button>
                        </div>
                    </div>
                </form>
                <!--内容区域-->
                <div class="layui-card-body">
                    <table id="baseDataTable" lay-filter="toolbar"></table>
                </div>
            </div>
        </div>
    </div>
</body>
</html>